const xhr4= new XMLHttpRequest()
const bannerlist = document.querySelector('.banner-list-tv')
xhr4.onreadystatechange = function() {
    if(xhr4.readyState === 4 && xhr4.status === 200) {
        const {data: res} = JSON.parse(xhr4.responseText)
        const ul = document.createElement('ul')
        bannerlist.appendChild(ul)
        for (let i = 0; i < 24; i++) {

            const li = document.createElement('li')
            ul.appendChild(li)
            li.style.cssText=' float: left;\n' +
                '    width: 248px;\n' +
                '    height: 76px;\n' +
                '    padding: 18px 0 18px 20px;\n' +
                '    box-sizing: border-box;'

            const img = document.createElement('img')
            img.src=res[1].product_picture
            img.style.width = 40 + 'px'
            li.appendChild(img)

            const span = document.createElement('span')
            const spanText = document.createTextNode(res[1].product_name)
            span.style.cssText='color:black; margin-right: 50px; line-height: 40px;\n' +
                '    font-size: 14px;\n' +
                '    white-space: nowrap;\n' +
                '    overflow: hidden;\n' +
                '    text-overflow: ellipsis;'
            span.appendChild(spanText)
            li.appendChild(span)
        }
    }

}
xhr4.open('GET','http://43.138.138.11:1110/api/category/2',true)
xhr4.send(null)